import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:my_app/app/modules/shimmer/shimmer_controller.dart';
import 'package:my_app/app/modules/shimmer/widgets/card_list_item.dart';
import 'package:my_app/app/modules/shimmer/widgets/circle_list_item.dart';
import 'package:my_app/app/core/theme/app_colors.dart';
import 'package:my_app/app/widgets/shimmer/shimmer.dart';
import 'package:my_app/app/widgets/shimmer/shimmer_loading_wiget.dart';

/// shimmer_page.dart
///
/// Created by fuchuanwei on Tue Feb 21 2023.
///
/// Description: 微光效果页面
///
class ShimmerPage extends GetView<ShimmerController> {
  @override
  Widget build(BuildContext context) {
    Get.put(ShimmerController());
    return Scaffold(
      appBar: AppBar(title: Text('微光效果')),
      floatingActionButton: FloatingActionButton(
        onPressed: () => controller.changeLoading(),
        child: Icon(Icons.restart_alt_rounded),
      ),
      body: Shimmer(
        linearGradient: shimmerGradient,
        child: Obx(() => ListView(
              physics: controller.isLoading.value
                  ? const NeverScrollableScrollPhysics()
                  : null,
              children: [
                const SizedBox(height: 16),
                _buildTopRowList(),
                const SizedBox(height: 16),
                _buildListItem(),
                _buildListItem(),
                _buildListItem(),
              ],
            )),
      ),
    );
  }

  Widget _buildTopRowList() {
    return SizedBox(
      height: 72,
      child: ListView(
        physics: controller.isLoading.value
            ? const NeverScrollableScrollPhysics()
            : null,
        scrollDirection: Axis.horizontal,
        shrinkWrap: true,
        children: [
          _buildTopRowItem(),
          _buildTopRowItem(),
          _buildTopRowItem(),
          _buildTopRowItem(),
          _buildTopRowItem(),
          _buildTopRowItem(),
        ],
      ),
    );
  }

  Widget _buildTopRowItem() {
    return ShimmerLoadingWidget(
      isLoading: controller.isLoading.value,
      child: const CircleListItem(),
    );
  }

  Widget _buildListItem() {
    return ShimmerLoadingWidget(
      isLoading: controller.isLoading.value,
      child: CardListItem(
        isLoading: controller.isLoading.value,
      ),
    );
  }
}
